var side_bar_html = "";
var listMarkers = [];

  function load(places, mapid) {
	if (GBrowserIsCompatible()) {
		var map = new GMap2(document.getElementById(mapid));

		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.addControl(new GOverviewMapControl());

		// Create a base icon for all of the church markers
		var baseIcon = new GIcon();
		baseIcon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
		baseIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
		baseIcon.iconSize = new GSize(12, 20);
		baseIcon.shadowSize = new GSize(22, 20);
		baseIcon.iconAnchor = new GPoint(6, 20);
		baseIcon.infoWindowAnchor = new GPoint(5, 1);
		baseIcon.infoShadowAnchor = new GPoint(18, 25);
		var icon = new GIcon(baseIcon);

		// Add markers for church stops on the map

		GDownloadUrl(places, function(data, responseCode) {
			var xml = GXml.parse(data);
			var startPoint = xml.documentElement;
			var county = startPoint.getAttribute("county");
			var shortname = startPoint.getAttribute("shortname");
			var mapCenterLat = startPoint.getAttribute("mapCenterLat");
			var mapCenterLng = startPoint.getAttribute("mapCenterLng");
			var zoom = parseFloat(startPoint.getAttribute("zoom"));
			map.setCenter(new GLatLng(mapCenterLat, mapCenterLng), zoom);
			var markers = xml.documentElement.getElementsByTagName("marker");
			for (i = 0; i < markers.length; i++) {
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
							parseFloat(markers[i].getAttribute("lng")));
				var details = markers[i].getAttribute("details");
				var body = markers[i].firstChild;
				map.addOverlay(createMarker(point, icon, markers[i].getAttribute("place"), markers[i].getAttribute("church"), i, details, shortname));
			}

		// put the assembled navigation list contents into the side_bar
		document.getElementById("side_bar").innerHTML = side_bar_html;
		});

	}
  }

  function createMarker(point, icon, place, church, i, details, shortname) {
	var marker = new GMarker(point, icon);
	GEvent.addListener(marker, "click", function() {
	marker.openInfoWindowHtml('<h3>' + place + '</h3>' + church);  });
        listMarkers[i] = marker;
        side_bar_html +=  '<a href="javascript:myclick(' + i + ')">' + '<img src="http://labs.google.com/ridefinder/images/mm_20_red.png" style="vertical-align: middle;">' + '</a> '
        				+ place +
        				' <a href="' + shortname + '/' + details + '">' + church + '</a><br/>';
	return marker;
  }

// This function picks up the click in the navigation list and opens the corresponding info window
  function myclick(i) {
	GEvent.trigger(listMarkers[i], "click");
  }